import {useEffect,useState} from 'react'
import {useAppSelector} from '@/store/hooks'
import {transformMenuDataToAntdMenu} from '@/utils/transform'
import {Menu} from 'antd'
import { MenuItem } from '@/types/Menu'
import  {useNavigate} from 'react-router-dom'

export default function SiderMenu() {
  const navigate=useNavigate()
  const [menus,setMenus]=useState(Array<MenuItem>)
  const state=useAppSelector((state:any)=>{
    return state
  })
  //根据用户名获取用户的权限的方法
  const getMenus=()=>{
    //获取用户名信息
    let dist=transformMenuDataToAntdMenu(state.menuModule.menus)
    setMenus(dist)
  }
  useEffect(()=>{
    getMenus()
  },[])
  return (
    <div>
      <Menu
       items={menus}
       mode="inline"
       theme='dark'
       onClick={(arg)=>{
        navigate(`/home${arg.key}`)
       }}>
    
      </Menu>
    </div>
  )
}
